﻿@media screen {

    body {

        div.vpgrid-quick-launch {
            height: 700px;
            width: 40px;
            background: #EFEFEF;
            background-image: url(images/quickLaunch.png);
            background-position: 7px 7px;
            background-repeat: no-repeat;
            -webkit-background-size: 24px;
            -ms-background-size: 24px;
            -o-background-size: 24px;
            background-size: 24px;
            opacity: 1;
            float: left;
            _display: inline-block;
            position: fixed;
            top: 0px;
            left: 0px;
        }
          
        div.vpgrid-container {
            clear:both;
            min-height: 700px;
            min-width: 600px;
            _display: inline-block;
            margin-left: 50px;
            font-size: 12px !important;
            font-family: Calibri,Cambria,Verdana,Arial,sans-serif;

            .fullScreen {
                position: absolute;
                top: 0px;
                left: 0px;
                margin: 0 0 0 0;
                background-color: white;
                width: 100%;
                height: 100%;
                z-index: 100;
            }

            .ui-widget {
                font-family: Calibri,Cambria,Verdana,Arial,sans-serif;
            }

            button.ui-widget {
                font-size: 12px;
                font-weight: bold;
            }

            .ui-jqgrid .ui-jqgrid-view {
                font-size: 0.9em;
            }

            h1.vpgrid-title {
                color: #f21e8c;
                text-align: left;
                letter-spacing: -1px;
                font-family: 'SketchFlow Print', 'Helvetica Neue',Verdana,Arial,sans-serif;
                font-size: 1.1em;
                margin-bottom: 7px;

                span {
                    color: inherit;
                    font-family: inherit;
                }
            }

            .vpgrid-hidden {
                display: none;
                width: 0px;
                height: 0px;
            }

            table {
                font-family: Calibri,Cambria,Verdana,Arial,sans-serif;

                th {
                    .center {
                        text-align: center;
                    }

                    .left {
                        float: left;
                        margin-left: 0.3em;
                    }

                    div.vpgrid-active-header {
                        cursor: pointer;
                        font-size: 1.0em;
                        vertical-align: middle;

                        span {
                            cursor: pointer;
                            font-size: 1.0em;
                            vertical-align: middle;
                        }

                            span.vpgrid-passive-header:after {
                                content: "";
                                display: inline-block;
                                background-position: -48px -80px;
                                background-image: url(images/ui-icons_f21e8c_256x240.png);
                                _float: right;
                                width: 16px;
                                height: 16px;
                                margin-left: 5px;
                                vertical-align: middle;
                            }
                    }
                }

                    th.ui-th-column {
                        div {
                            font-weight: bold;
                            font-size: 1.0em;
                            padding-top: 3px;
                            text-overflow: ellipsis;
                            white-space: normal;
                            height: auto;
                            max-height: 42px;
                            display: inline-block;
                        }
                          
                            div.ui-jqgrid-sortable {
                                font: inherit;
                                font-family: Calibri,Cambria,Verdana,Arial,sans-serif;
                                font-weight: bold;
                                font-size: 1.0em;
                                text-overflow: ellipsis;
                                color: inherit;

                                span {
                                    font: inherit;
                                    color: inherit;
                                }
                            }
                    }

                    th.vpgrid-filter-toolbar {
                        border: 1px solid #aaaaaa;
                        background: #dedade url(images/ui-bg_highlight-hard_60_dedade_1x100.png) 50% 50% repeat-x;
                        color: #222222;
                        font-weight: bold;
                    }

                    th.vpgrid-group-header {
                        border: 1px solid #aaaaaa;
                        background: #dedade url(images/ui-bg_highlight-hard_60_dedade_1x100.png) 50% 50% repeat-x;
                        color: #222222;
                        font-weight: bold;
                    }

                tr.ui-widget-content.jqgrow {

                    td {
                        input.cbox {
                            cursor: pointer;
                        }

                        div.vpgrid-button-delete {
                            cursor: pointer;

                            span.ui-icon:hover {
                                background-image: url(images/ui-icons_f21e8c_256x240.png);
                            }
                        }

                        div.vpgrid-button-delete:hover {
                                span.ui-icon {
                                    background-image: url(images/ui-icons_f21e8c_256x240.png);
                                }
                            }

                        textarea {
                            width: 100%;
                            _height: 100%;
                            box-sizing: border-box; /* For IE and modern versions of Chrome */
                            -moz-box-sizing: border-box; /* For Firefox                          */
                            -webkit-box-sizing: border-box; /* For Safari                           */
                            resize: both;
                            _background-color:aliceblue;
                            z-index:10000;
                            opacity : 1;
                            overflow:auto; 
                        }
                    }
                     
                        td.vpgrid-cell {
                            padding-left: 5px;
                        }

                        td.white {
                            background: #FFFFFF;
                        }

                        td.no-border {
                            border-top-style: none;
                            border-right-style: none;
                            border-bottom-style: none;
                            border-left-style: none;
                        }

                        td.no-border-top {
                            border-top-style: none;
                        }

                        td.no-border-right {
                            border-right-style: none;
                        }

                        td.no-border-bottom {
                            border-bottom-style: none;
                        }

                        td.border-bottom-dashed {
                            border-bottom-color: inherit;
                            border-bottom-style: dashed;
                        }

                        td.border-right-medium {
                            border-right-color: inherit;
                            border-right-width: medium;
                        }

                        td.border-bottom-default {
                            border-bottom-color: inherit;
                            border-bottom-style: solid;
                            border-bottom-width: 1px;
                        }

                        td.text-white {
                            color: white;
                        }

                        td.text-bisque {
                            color: bisque;
                        }


                        td.background-color-azure {
                            background-color: azure;
                        }

                        td.background-color-honeydew {
                            background-color: honeydew;
                        }

                        td.background-color-ivory {
                            background-color: ivory;
                        }

                        td.background-color-blanchedalmond {
                            background-color: blanchedalmond;
                        }


                        td.background-color-blanchedalmond-2 {
                            background-color: rgb(247, 220, 181);
                        }

                        td.background-color-yellow {
                            background-color: rgb(248,248,159);
                        }

                        td.background-color-yellow2 {
                            background-color: rgb(224, 218, 77);
                        }

                        td.background-color-green {
                            background-color: #E7F8D1;
                        }

                        td.background-color-green2 {
                            background-color: #E7F087;
                        }

                        td.background-color-orange {
                            background-color: rgb(248, 206, 72);
                        }

                        td.background-color-grey1 {
                            background-color: #EBE6EB;
                        }

                        td.background-color-grey2 {
                            background-color: #E2DCE2;
                        }

                        td.background-color-bisque {
                            background-color: bisque;
                        }



                        td.font-weight-bold {
                            font-weight: bold;
                        }


                        td.vpgrid-not-editable {
                            cursor: default;
                        }

                        td.vpgrid-editable {
                            cursor: pointer;
                        }

                            td.vpgrid-editable.summary-grid-cell {
                                cursor: context-menu;
                            }

                        td.ui-state-error {
                            border-bottom-width: 1px;
                            border-top-width: 0px;
                            border-left-width: 0px;
                            border-right-width: 1px;
                            border-color: inherit;
                            background: #FFC8ED;
                            color: inherit;
                        }

                        td.ui-state-black {
                            border-bottom-width: 1px;
                            border-top-width: 0px;
                            border-left-width: 0px;
                            border-right-width: 1px;
                            border-color: inherit;
                            background: #8F8B8B;
                            color: #FFF5FC;
                            font-weight: bold;
                        }

                        td.ui-state-grey2 {
                            border-bottom-width: 1px;
                            border-top-width: 0px;
                            border-left-width: 0px;
                            border-right-width: 1px;
                            border-color: inherit;
                            background: #838083;
                            color: #FFF5FC;
                            font-weight: inherit;
                        }

                        td.ui-state-grey {
                            border-bottom-width: 1px;
                            border-top-width: 0px;
                            border-left-width: 0px;
                            border-right-width: 1px;
                            border-color: inherit;
                            background: #F7F3F7 url(images/ui-bg_highlight-hard_60_F7F3F7_1x100.png) 50% 50% repeat-x;
                            color: inherit;
                        }



                        td.vpgrid-locked:before {
                            content: "";
                            display: inline-block;
                            background-position: -192px -96px;
                            background-image: url(images/ui-icons_f21e8c_256x240.png);
                            _float: right;
                            width: 16px;
                            height: 16px;
                            margin-left: 5px;
                            vertical-align: middle;
                        }

                        td.vpgrid-refresh:before {
                            content: "";
                            display: inline-block;
                            background-position: -64px -80px;
                            background-image: url(images/ui-icons_f21e8c_256x240.png);
                            float: right;
                            width: 16px;
                            height: 16px;
                            margin-left: 5px;
                            vertical-align: middle;
                        }

                        td.vpgrid-data-unavailable {
                            background-image: url(images/bg_unavailable.png);
                            background-size: cover;
                        }
                }

                    tr.ui-widget-content.jqgrow:hover {
                        td {
                            color: #3f3f3f;
                            _cursor: pointer;
                            background: #F7F3F7 url(images/ui-bg_highlight-hard_60_F7F3F7_1x100.png) repeat-x 60% 60%;
                        }
                    }

                    tr.ui-widget-content.jqgrow.ui-state-hover {
                        div.vpgrid-button-delete {
                            cursor: pointer;

                            span.ui-icon {
                                background-image: url(images/ui-icons_454545_256x240.png);
                            }

                                span.ui-icon:hover {
                                    background-image: url(images/ui-icons_f21e8c_256x240.png);
                                }
                        }

                            div.vpgrid-button-delete:hover {
                                span.ui-icon {
                                    background-image: url(images/ui-icons_f21e8c_256x240.png);
                                }
                            }

                        a, a:link {
                            color: inherit;
                        }
                    }

                        tr.ui-widget-content.jqgrow.ui-state-hover.edited {
                            background: inherit;
                            color: inherit;
                        }

                        tr.ui-widget-content.jqgrow.ui-state-hover.selected-row {
                            background: inherit;
                            color: inherit;
                        }

                        tr.ui-widget-content.jqgrow.ui-state-hover.edited.selected-row {
                            background: inherit;
                            color: inherit;
                        }

                        tr.ui-widget-content.jqgrow.ui-state-hover.ui-state-to-be-deleted {
                            background: inherit;
                            color: inherit;

                            td {
                                background: #f21e8c url(images/ui-bg_highlight-hard_60_f21e8c_1x100.png) repeat-x 50% 50%;
                                color: white;
                            }
                        }
                    /* inline summary row styling*/
                    tr.ui-widget-content.jqgrow.has-summary-row-after {

                        td {
                            border-bottom-color: inherit;
                            border-bottom-style: dashed;
                        }
                    }

                    tr.ui-widget-content.jqgrow.is-summary-row-before {

                        td {
                            border-bottom-color: inherit;
                            border-bottom-style: dashed;
                        }

                            td.white {
                                background: #FFFFFF;
                            }

                            td.no-border {
                                border-top-style: none;
                                border-right-style: none;
                                border-bottom-style: none;
                                border-left-style: none;
                            }

                            td.no-border-top {
                                border-top-style: none;
                            }

                            td.no-border-right {
                                border-right-style: none;
                            }

                            td.no-border-bottom {
                                border-bottom-style: none;
                            }

                            td.background-color-azure {
                                background-color: azure;
                            }

                            td.background-color-honeydew {
                                background-color: honeydew;
                            }

                            td.background-color-ivory {
                                background-color: ivory;
                            }
                    }

                textarea {
                    width: 100%;
                    _height: 100%;
                    box-sizing: border-box; /* For IE and modern versions of Chrome */
                    -moz-box-sizing: border-box; /* For Firefox                          */
                    -webkit-box-sizing: border-box; /* For Safari                           */
                    resize: both;
                }

                .vpgrid-input-field {
                    width: 100%;
                    _height: 34px;
                    _padding: 6px 12px;
                    _font-size: 14px;
                    _line-height: 1.42857143;
                    _color: #555;
                    background-color: #fff;
                    background-image: none;
                    border: 1px solid #ccc;
                    border-radius: 4px;
                    -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
                    box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
                    -webkit-transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
                    transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
                }

                    .vpgrid-input-field:focus {
                        border-color: #66afe9;
                        outline: 0;
                        -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075),0 0 8px rgba(102,175,233,.6);
                        box-shadow: inset 0 1px 1px rgba(0,0,0,.075),0 0 8px rgba(102,175,233,.6);
                    }

                    .vpgrid-input-field:hover {
                        border-color: #66afe9;
                        outline: 0;
                        -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075),0 0 8px rgba(102,175,233,.6);
                        box-shadow: inset 0 1px 1px rgba(0,0,0,.075),0 0 8px rgba(102,175,233,.6);
                    }


                td.ui-search-input {
                    width: 100%;
                }

                td.ui-search-oper {
                    a.soptclass {
                        color: #f21e8c;
                    }
                }

                td.ui-search-clear {
                    a.clearsearchclass {
                        color: #f21e8c;
                    }
                }
            }

            div.ui-jqgrid-view {
                div.vpgrid-status-bar {
                    border: 0px solid #aaaaaa;
                    border-top: 1px solid #aaaaaa;
                    _background: #dedade url(images/ui-bg_highlight-hard_60_dedade_1x100.png) 50% 50% repeat-x;
                    background: #F7F3F7 url(images/ui-bg_highlight-hard_60_F7F3F7_1x100.png) 50% 50% repeat-x;
                    color: #676767;
                    font-weight: bold;
                    height: 20px;
                    vertical-align: middle;
                    border-bottom-left-radius: 4px;
                    border-bottom-right-radius: 4px;

                    div.vpgrid-status-group {
                        float: right;
                        vertical-align: middle;
                        height: 100%;
                        min-height: 20px;
                        text-overflow: ellipsis;
                        margin-top: 3px;
                        margin-right: 5px;
                    }
                }

                div.vpgrid-summary-rows {
                    border: 3px solid #aaaaaa;
                    border-top: 1px solid #aaaaaa;
                    _background: #dedade url(images/ui-bg_highlight-hard_60_dedade_1x100.png) 50% 50% repeat-x;
                    background: #F7F3F7 url(images/ui-bg_highlight-hard_60_F7F3F7_1x100.png) 50% 50% repeat-x;
                    color: #676767;
                    font-weight: bold;
                    height: 30px;
                    vertical-align: middle;

                    td, td.default {
                        background: #F7F3F7 url(images/ui-bg_highlight-hard_60_F7F3F7_1x100.png) 50% 50% repeat-x;
                        color: #676767;
                        font-weight: bold;
                        font-size: smaller;
                        height: 30px;

                        span.float-right {
                            float: right;
                        }

                        span.italic {
                            font-style: italic;
                        }
                    }

                        td.white {
                            background: #FFFFFF;
                        }

                        td.background-color-bisque {
                            background: bisque;
                        }

                        td.no-border {
                            border-top-style: none;
                            border-right-style: none;
                        }

                        td.ui-state-error {
                            border-bottom-width: 1px;
                            border-top-width: 0px;
                            border-left-width: 0px;
                            border-right-width: 1px;
                            border-color: inherit;
                            background: #FFC8ED;
                            color: inherit;
                        }

                        td.ui-state-valid {
                            border-bottom-width: 1px;
                            border-top-width: 0px;
                            border-left-width: 0px;
                            border-right-width: 1px;
                            border-color: inherit;
                            background: #C8FFE2;
                            color: inherit;
                        }

                        td.vpgrid-refresh:before {
                            content: "";
                            display: inline-block;
                            background-position: -64px -80px;
                            background-image: url(images/ui-icons_f21e8c_256x240.png);
                            float: right;
                            width: 16px;
                            height: 16px;
                            margin-left: 5px;
                            vertical-align: middle;
                        }
                }
            }

            div.ui-jqgrid-titlebar {
                span.vpgrid-view-settings-button {
                    cursor: pointer;
                    vertical-align: middle;
                    vertical-align: -webkit-baseline-middle;
                    float: right;
                }

                    span.vpgrid-view-settings-button:after {
                        content: "";
                        display: inline-block;
                        background-position: -192px -112px;
                        background-image: url(images/ui-icons_f21e8c_256x240.png);
                        _float: right;
                        width: 16px;
                        height: 16px;
                        margin-left: 5px;
                        vertical-align: middle;
                        vertical-align: -webkit-baseline-middle;
                    }
            }
            /* dynamic grid*/
            .vp-row {
                /* apply a natural box layout model to all elements */
                *, *:before, *:after {
                    -moz-box-sizing: border-box;
                    -webkit-box-sizing: border-box;
                    box-sizing: border-box;
                    font-size: 11px;
                }

                vertical-align: middle;
                text-overflow: ellipsis;
                min-width: 500px;
                /* sub grid css rules */
                .vp-row {
                    min-width: 300px;
                }

                div.vpgrid-active-header {
                    cursor: pointer;
                    _font-size: 0.8em;
                    vertical-align: middle;



                    span {
                        cursor: pointer;
                        _font-size: 0.8em;
                        _vertical-align: middle;
                        _vertical-align: -webkit-baseline-middle;
                    }

                        span.vpgrid-passive-header:after {
                            content: "";
                            display: inline-block;
                            background-position: -48px -80px;
                            background-image: url(images/ui-icons_f21e8c_256x240.png);
                            _float: right;
                            width: 16px;
                            height: 16px;
                            margin-left: 5px;
                            vertical-align: middle;
                        }
                }

                div.ui-widget-header {
                    font-weight: bold;
                }

                .span12 {
                    width: 100%;
                    float: left;
                    _vertical-align: middle;
                    height: 28px;
                    min-height: 28px;
                    line-height: 26px;
                    text-overflow: ellipsis;
                }

                .span11 {
                    width: 91%;
                    float: left;
                    _vertical-align: middle;
                    height: 28px;
                    min-height: 28px;
                    line-height: 26px;
                    text-overflow: ellipsis;
                }

                .span10 {
                    width: 83%;
                    float: left;
                    _vertical-align: middle;
                    height: 28px;
                    min-height: 28px;
                    line-height: 26px;
                    text-overflow: ellipsis;
                }

                .span9 {
                    width: 75%;
                    float: left;
                    _vertical-align: middle;
                    height: 28px;
                    min-height: 28px;
                    line-height: 26px;
                    text-overflow: ellipsis;
                }

                .span8 {
                    width: 65%;
                    float: left;
                    _vertical-align: middle;
                    height: 28px;
                    min-height: 28px;
                    line-height: 26px;
                    text-overflow: ellipsis;
                }

                .span7 {
                    width: 58%;
                    float: left;
                    _vertical-align: middle;
                    height: 28px;
                    min-height: 28px;
                    line-height: 26px;
                    text-overflow: ellipsis;
                }

                .span6 {
                    width: 50%;
                    float: left;
                    _vertical-align: middle;
                    height: 28px;
                    min-height: 28px;
                    line-height: 26px;
                    text-overflow: ellipsis;
                }

                .span5 {
                    width: 41%;
                    float: left;
                    _vertical-align: middle;
                    height: 28px;
                    min-height: 28px;
                    line-height: 26px;
                    text-overflow: ellipsis;
                }

                .span4 {
                    width: 33.3%;
                    float: left;
                    _vertical-align: middle;
                    height: 28px;
                    min-height: 28px;
                    line-height: 26px;
                    text-overflow: ellipsis;
                }

                .span3 {
                    width: 25%;
                    float: left;
                    _vertical-align: middle;
                    height: 28px;
                    min-height: 28px;
                    line-height: 26px;
                    text-overflow: ellipsis;
                }

                .span2 {
                    width: 16.63%;
                    float: left;
                    _vertical-align: middle;
                    height: 28px;
                    min-height: 28px;
                    line-height: 26px;
                    text-overflow: ellipsis;
                }

                .span1 {
                    width: 8%;
                    float: left;
                    _vertical-align: middle;
                    height: 28px;
                    min-height: 28px;
                    line-height: 26px;
                    text-overflow: ellipsis;
                }

                .span12.height-auto {
                    height: auto;
                }

                .span11.height-auto {
                    height: auto;
                }

                .span10.height-auto {
                    height: auto;
                }

                .span9.height-auto {
                    height: auto;
                }

                .span8.height-auto {
                    height: auto;
                }

                .span7.height-auto {
                    height: auto;
                }

                .span6.height-auto {
                    height: auto;
                }

                .span5.height-auto {
                    height: auto;
                }

                .span4.height-auto {
                    height: auto;
                }

                .span3.height-auto {
                    height: auto;
                }

                .span2.height-auto {
                    height: auto;
                }

                .span1.height-auto {
                    height: auto;
                }

                .left-border {
                    border-left-style: solid;
                    border-left-width: thin;
                    border-left-color: #CCCCCC;
                }

                .right-border {
                    border-right-style: solid;
                    border-right-width: thin;
                    border-right-color: #CCCCCC;
                }

                .bottom-border {
                    border-bottom-style: solid;
                    border-bottom-width: thin;
                    border-bottom-color: #CCCCCC;
                }

                .text-left {
                    text-align: left;
                    white-space: nowrap;
                    overflow: hidden;
                    padding-left: 5px;
                }

                .text-right {
                    text-align: right;
                    white-space: nowrap;
                    overflow: hidden;
                    padding-right: 5px;
                }

                .text-center {
                    text-align: center;
                    white-space: nowrap;
                    overflow: hidden;
                    margin-left: auto;
                    margin-right: auto;
                }

                .text-strong {
                    font-weight: bolder;
                }

                .text-small {
                    font-size: 0.8em;
                }

                input.text {
                    width: 100%;
                    min-width: 70%;
                    _vertical-align: middle;
                    _vertical-align: -webkit-baseline-middle;
                }

                textarea {
                    width: 100%;
                    min-width: 70%;
                    height: 90%;
                }

                select {
                    width: 100%;
                    min-width: 70%;
                    _vertical-align: middle;
                    _vertical-align: -webkit-baseline-middle;
                }

                img {
                    _vertical-align: middle;
                    _vertical-align: -webkit-baseline-middle;
                }


                .float-left {
                    float: left;
                }

                .float-right {
                    float: right;
                }
                 
                div.ui-validation-message {
                    margin-top: -7px;
                    padding-left: 10px;
                    text-align: left;
                    white-space: normal;
                    overflow: visible;
                    font-size: 0.9em;
                    color: #cd0a0a;
                    -moz-text-overflow: ellipsis;
                    text-overflow: ellipsis;
                    height:20px;
                    line-height:10px;
                }
            }

                .vp-row:before,
                .vp-row:after {
                    display: table;
                    line-height: 0;
                    content: "";
                }

                .vp-row:after {
                    clear: both;
                }

            .vp-row-header {
                height: 28px;
                min-height: 28px;
                line-height: 26px;
                background-color: #CCCCCC;
                font-weight: bold;

                span {
                    _vertical-align: middle;
                    _vertical-align: -webkit-baseline-middle;
                }
            }

            .vp-row.vp-modal-dialog-bottom-buttons {
                height: 32px;
                min-height: 32px;

                button {
                    vertical-align: middle;
                    vertical-align: -webkit-baseline-middle;
                }
            }

            .vp-row-bigheader {
                height: 30px;
                background-color: #3399FF;
            }

            hr {
                margin: 10px 0;
                border: 0;
                width: 80%;
                border-top: 1px solid #eeeeee;
                margin-right: auto;
                margin-left: auto;
                height:0px;
                background-color: #eeeeee;
            }


            div.vpgrid-settings-button {
                cursor: pointer;
                _font-size: 0.8em;
                vertical-align: middle;
                float: right;

                span {
                    cursor: pointer;
                    _font-size: 0.8em;
                    _vertical-align: middle;
                    _vertical-align: -webkit-baseline-middle;
                }

                    span:after {
                        content: "";
                        display: inline-block;
                        background-position: -48px -128px;
                        background-image: url(images/ui-icons_f21e8c_256x240.png);
                        _float: right;
                        width: 16px;
                        height: 16px;
                        margin-left: 5px;
                        vertical-align: middle;
                    }

                    span.second {
                        position: relative;
                        left: -25px;
                        top: -4px;
                    }

                    span.third {
                        position: relative;
                        left: -50px;
                        top: -8px;
                    }
            }

            div.vpgrid-footer {
                div.vpgrid-footer-body {
                    padding-left: 7px;
                    vertical-align: middle;
                    margin-top: 5px;
                    margin-bottom: 5px;
                }
            }
             
            div.vpgrid-header {
                div.vpgrid-header-body {
                    padding-left: 7px;
                    vertical-align: middle;
                    margin-bottom: 5px;
                }
            }

            div.vpgrid-body {
                clear:both;
            }
        }

        
        div.vpgrid-container.fullScreen {
                position: absolute;
                top: 0px;
                left: 0px;
                margin: 0 0 0 0;
                background-color: white;
                width: 100%;
                height: 100%;
                z-index: 100;
            }
        
        div.vpgrid-container.vpgrid-modal-dialog {
            min-height: 100px;
            min-width: 600px;
            margin-left: 0px;
        }



        div.ui-dialog {
            div.ui-dialog-titlebar {
                padding: 0.2em 0.2em;
                min-height: 15px;

                span.ui-dialog-title {
                    font-size: 13px;
                    text-align: center;
                }

                select {
                    background: #F7F3F7;
                    height: 29px;
                    _width: 50%;
                    max-width: 50%;
                }
            }

            ul.ui-autocomplete {
                _height: 30%;
                max-height: 118px;
                overflow-y: auto;
                /* prevent horizontal scrollbar */
                overflow-x: hidden;
                min-width: 110px;
                font-size: 11px;
            }


            .vpgrid-input-field {
                width: 100%;
                _height: 34px;
                _padding: 6px 12px;
                _font-size: 14px;
                _line-height: 1.42857143;
                _color: #555;
                background-color: #fff;
                background-image: none;
                border: 1px solid #ccc;
                border-radius: 4px;
                -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
                box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
                -webkit-transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
                transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
            }

                .vpgrid-input-field:focus {
                    border-color: #66afe9;
                    outline: 0;
                    -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075),0 0 8px rgba(102,175,233,.6);
                    box-shadow: inset 0 1px 1px rgba(0,0,0,.075),0 0 8px rgba(102,175,233,.6);
                }

                .vpgrid-input-field:hover {
                    border-color: #66afe9;
                    outline: 0;
                    -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075),0 0 8px rgba(102,175,233,.6);
                    box-shadow: inset 0 1px 1px rgba(0,0,0,.075),0 0 8px rgba(102,175,233,.6);
                }

                .vpgrid-input-field.ui-state-error {
                    border: 1px solid #cd0a0a;
                    background: #fef1ec url(images/ui-bg_glass_95_fef1ec_1x400.png) 50% 50% repeat-x;
                    color: #cd0a0a;
                    margin-bottom:10px;
                }
        }

        div.no-border {
            border: none !important;
        }

        .ui-button .ui-button-text {
            color: inherit;
            font-family: Calibri,Cambria,Verdana,Arial,sans-serif;
            font-size: 12px;
            font-weight: bold;

            span {
                color: inherit;
                font-family: inherit;
                font-size: inherit;
                font-weight: inherit;
            }
        }

        ul.ui-autocomplete {
            _height: 30%;
            max-height: 200px;
            overflow-y: auto;
            /* prevent horizontal scrollbar */
            overflow-x: hidden;
            min-width: 100px;
            font-size: 11px;
        }

        div.ui-resizable-se {
            bottom: 17px;
        }

        .ui-tabs .ui-tabs-nav li {
            font-size: 12px;
            font-weight: bold;

            a:hover {
                text-decoration: none;
            }
        }

        #vpgrid-ui-notification-area {
            position: fixed;
            top: 50px;
            right: 10px;
        }

            #vpgrid-ui-notification-area .qtip {
                position: static;
                min-height: 0;
                overflow: hidden;
                margin: 0 0 5px 0;
            }

        .template-download, .template-upload {
            p.name {
                margin-bottom: 0px;
                padding-left: 5px;
                padding-right: 5px;
            }
        }


        ul.ui-tabs-nav {
            li.ui-tabs.ui-state-focus {
            }
        }
    }

}